<template>
  <div>
    <img class="courseImgView" :src="data.picVertical"/>
    <p class="ellipsis2 nameLabel">{{data.title}}</p>
    <p class="countLabel">已学习{{data.courseCount + data.examCount + data.docCount}}次</p>
    <p class="passLabel" :class="{passedColor: isPassed}" >{{data.subjectExamStatus === 1 ? '已通过测试' : '未通过测试'}}</p>
  </div>
</template>

<script>
  export default {
    name: "HistoryCell",
    props: ["data"],
    computed:{
      isPassed(){
        if(this.data){
          if(this.data.subjectExamStatus === 1){
            return true
          }
        }
        return false;
      }
    },
  }
</script>

<style scoped>
  .courseImgView {
    width: 100%;
  }
  .nameLabel {
    margin-top: 4px;
    font-size: 16px;
    font-weight: bold;
    color: #333333;
    min-height: 42px;
  }
  .countLabel {
    color: #9B9B9B;
    font-size: 12px;
  }
  .passLabel{
    color: #ff4f35;
    font-size: 12px;
    /*margin-top: 8px;*/
  }
  .passedColor{
    color: #1DA1F2;;
  }


</style>
